<!DOCTYPE html>
<html>

  <head>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <title>PrimeNG - Serenity - Login</title>

    <link rel="stylesheet" type="text/css" href="../theme/theme-bluegrey.css">
    <link rel="stylesheet" type="text/css" href="../layout/css/layout-bluegrey.css">
    <link rel="stylesheet" type="text/css" href="primeng.min.css">
    
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript" src="../layout/script/ripple.js"></script>
    <script type="text/javascript">
        $(function() {
            $('input').on('blur', function(e) {
                var el = $(this);
                if(el.val() != '')
                    el.addClass('ui-state-filled');
                else
                    el.removeClass('ui-state-filled');
            });
        });
    </script>
  </head>
 
  <body class="login-body">
      <div class="login-panel ui-fluid">
            <div class="login-panel-header">
                <img src="../layout/images/logo-slim.png">
            </div>
            <div class="login-panel-content">
                <div class="ui-g">
                    <div class="ui-g-12">
                        <h1>Sign-in to Serenity Network</h1>
                    </div>
                    <div class="ui-g-12">
                        <span class="md-inputfield">
                            <input type="text" autocomplete="off" class="ui-inputtext ui-corner-all ui-widget">
                            <label>Username</label>
                        </span>
                    </div>
                    <div class="ui-g-12">
                        <span class="md-inputfield">
                            <input type="password" autocomplete="off" class="ui-inputtext ui-corner-all ui-widget">
                            <label>Password</label>
                        </span>
                    </div>
                    <div class="ui-g-12">
                        <button type="button" class="ui-button ui-widget ui-corner-all ui-button-text-icon-left">
                            <span class="ui-button-icon-left fa ui-icon-person"></span>
                            <span class="ui-button-text">Sign In</span>
                        </button>
                    </div>
                    <div class="ui-g-12">
                        Don't have an account? <a href="#">Sign Up</a> now.
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>
